
<template>
	<div class="mainContent">
		<pathTracking :path='Model.path' />
		<div class="deliverynoti-container">
			<!-- 表格 -->
			<div class="table">
				<el-row>
					<div class="common-table-title">
						<div class="common-table-icon"></div>
						<div class="common-table-fl">售价查询</div>
					</div>
				</el-row>
				<div class="dialogBody">
					<div class="itemBox dialogSecTitle havecode">
						<el-radio v-model="Model.barCodeRadio" label="1">有明确条码</el-radio>
						<el-form ref="form" label-width="80px" size="small" :inline="true">
							<el-form-item label="条码" >
								<el-input placeholder="请输入条码" v-model="Model.filterOption.batchNumber" :disabled="Model.barCodeRadio!=1" ></el-input>
							</el-form-item>
							<el-form-item label="定制编码">
								<el-input placeholder="请输入定制编码" v-model="Model.filterOption.customCoding" :disabled="Model.barCodeRadio!=1" ></el-input>
							</el-form-item>
							<el-form-item>
								<div class="endFormItem normal-btn-group">
									<div class="normal-btn query-btn" :class="Model.barCodeRadio!=1?['disabledBtn']:[]" @click="onSearchSureBarCode">
										<img class="icon" src="@/assets/img/button_search.png" alt> 查询
									</div>
								</div>
							</el-form-item>
						</el-form>
					</div>
					<div class="itemBox">
						<div class="dialogSecTitle">
							<el-radio v-model="Model.barCodeRadio" label="2">无明确条码</el-radio>
						</div>
						<p class="tips" v-show="Model.barCodeRadio!=2">选择后填写更具体的查询条件</p>
						<div class="nocode" v-show="Model.barCodeRadio!=1">
							<div class="step-first">
								<div class="thestepTitle">
									<span>1</span>
									<p>第一步：请选择款式信息</p>
								</div>
								<advancedSearch :option="Model.filterOption2" @getChild="showChild"></advancedSearch>
							</div>
							<div class="step-sec">
								<div class="thestepTitle">
									<span>2</span>
									<p>第二步：请选择具体参数</p>
								</div>
								<div class="sliderBox">
									<div class="sliderItem">
										<div>
											<div class="sliderItemLabel">钻重范围</div>
											<div class="sliderItemValue">：
												{{Model.sliderSelect.weight.sliderVal[0]+'~'+Model.sliderSelect.weight.sliderVal[1]}}</div>
											<el-select style="width:100px" size="small" v-model="Model.sliderSelect.weight.value" placeholder="请选择" @change="onSelectChange('weight')">
												<el-option v-for="(item,index) in Model.sliderSelect.weight.option" :key="index" :label="item.label" :value="item.value"></el-option>
											</el-select>
											分(100分=1克拉)
										</div>
										<div>
											<el-slider v-model="Model.sliderSelect.weight.sliderVal" range :min="Model.weightMin" :max="Model.weightMax"></el-slider>
										</div>
									</div>
									<!--<div class="sliderItem">
										<div>
											<div class="sliderItemLabel">手寸范围</div>
											<div class="sliderItemValue">：
												{{Model.sliderSelect.size.sliderVal[0]+'~'+Model.sliderSelect.size.sliderVal[1]}}</div>
											<el-select style="width:100px" size="small" v-model="Model.sliderSelect.size.value" placeholder="请选择" @change="onSelectChange('size')">
												<el-option v-for="(item,index) in Model.sliderSelect.size.option" :key="index" :label="item.label" :value="item.value"></el-option>
											</el-select>
											mm
										</div>
										<div>
											<el-slider v-model="Model.sliderSelect.size.sliderVal" range></el-slider>
										</div>
									</div>-->
								</div>
						</div>
						<advancedSearch
							:option="Model.filterOption3"
							@getChild="showNotSureBarCodeP2"
							@onSearch="toSearchNotSureBarCode"
							@onClear="toClear"
						></advancedSearch>
					</div>
					<div class="dialogTable">
						<p class="dialogShopTitle">商品信息列表</p>
						<div class="normal-btn-group addBtn">
							<div class="normal-btn query-btn" @click="addProduct(true)">加入预选清单</div>
						</div>
						<el-row class="table-bg">
							<el-table :data="Model.dialogTableData" style="width: 100%" max-height="550" @selection-change="handleSelectionChange">
								<!--<el-table-column width="50" fixed>
									<template slot-scope="scope">
										<el-radio v-model="Model.dialogTableSelect" :label="scope.row">{{scope.row.poCode}}</el-radio>
									</template>
								</el-table-column>-->
								<el-table-column
									type="selection"
									fixed="left"
									align="center" 
									width="50">
								</el-table-column>
								<el-table-column prop="finishProduct" label="现货成品" width="120">
									<template slot="header" slot-scope="scope">
										<el-tooltip content="钻石信息顺序:颜色-净度-切工-抛光-对称-荧光" placement="top">
											<span class="questionTips">现货成品</span>
										</el-tooltip>
									</template>
								</el-table-column>
								<el-table-column prop="store" label="门店" width="140"></el-table-column>
								<el-table-column prop="location" label="仓位" width="140"></el-table-column>
								<el-table-column prop="modelName" label="款式名称" width="120"></el-table-column>
								<el-table-column prop="modelNo" label="款式号" width="120"></el-table-column>
								<el-table-column prop="category" label="品类" width="140"></el-table-column>
								<el-table-column prop="aSeriesOf" label="系列" width="120"></el-table-column>
								<el-table-column prop="barCode" label="条码" width="140"></el-table-column>
								<el-table-column prop="handInch" label="手寸" sortable width="120"></el-table-column>
								<el-table-column prop="bracketMaterial" label="材质" width="140"></el-table-column>
								<el-table-column prop="drillingWeight" label="钻重" sortable width="120"></el-table-column>
								<el-table-column prop="shape" label="主石形状" sortable width="140"></el-table-column>
								<el-table-column prop="appearance" label="主石外观" width="120"></el-table-column>
								<el-table-column prop="cut" label="切工" sortable width="120"></el-table-column>
								<el-table-column prop="polishing" label="抛光" sortable width="120"></el-table-column>
								<el-table-column prop="color" label="颜色" sortable width="120"></el-table-column>
								<el-table-column prop="cleanliness" label="净度" sortable width="120"></el-table-column>
								<el-table-column prop="symmetric" label="对称" sortable width="120"></el-table-column>
								<el-table-column prop="price" label="价格/RMB" sortable width="120"></el-table-column>
							</el-table>
						</el-row>	
						<!-- 分页 -->
						<el-row class="pagination-cont">
							<el-pagination
								@size-change="handleSizeChange"
								background
								@current-change="handleCurrentChange"
								:current-page="Model.pager.params.pageIndex"
								:page-sizes="Model.pager.pageSizeArr"
								:page-size="Model.pager.params.pageSize"
								:pager-count="5"
								layout="total, sizes, prev, pager, next, jumper"
								:total="Model.pager.pageTotal"
							></el-pagination>
						</el-row>
					</div>
				</div>
			</div>  
			<el-dialog title :visible.sync="Model.addProduct" class="addProduct">
				<div class="common-table-title">
					<div class="common-table-icon"></div>
					<div class="common-table-fl">加入预选清单操作</div>
				</div>
				<div class="productBody">
					<div class="productFirst">
						<el-radio-group v-model="Model.chooseTeam">
							<ul class="TeamList">
								<li v-for="(item, index) in Model.TeamName" :key = "index">
									<el-radio :label="item.id">{{item.isEdit ? '' : item.name }}</el-radio>
									<el-input class="writeInput" ref="teamInput" @blur="SaveWrite(item)" v-show="item.isEdit" v-model="item.name"></el-input>
									<div class="Teamoperation">
										<i class="Btnwrite" @click="Towrite(item,index)"></i>
										<i class="Btndelete" @click="del(item,index)">删除</i>
									</div>
								</li>
								<li>
									<div class="addNewteam">
										<div class="normal-btn" @click="addTeam(true)"><img class="plus" src="@/assets/img/button_plus.png" alt="">添加分组</div>
										<div class="productBody" v-show="Model.addNewteam">
											<div class="productSec">
												<el-form ref="form" size="small" :inline="false">
													<el-form-item label="分组名称:" >
														<el-input v-model="Model.Groupingname"></el-input>
													</el-form-item>
												</el-form>
												<div class="normal-btn-group btnCenter">
													<div class="normal-btn query-btn" @click="addSureteam(true)">确认</div>
													<div class="normal-btn empty-input-btn" @click="Model.addNewteam=false">取消</div>
												</div>
											</div>
										</div>
									</div>
								</li>
							</ul>
						</el-radio-group>
						
						<!--<el-radio-group v-model="Model.chooseTeam">
							<el-radio v-for="(item,index) in Model.TeamName"
								:key="index"
								:label="item.id"
								:value="item.name">
								<span v-if='Model.flag'>{{item.name}}</span>
								<el-input v-else v-model="Model.writting" placeholder="请输入内容"></el-input>
								<i class="Btnwrite" @click="Towrite(item)"></i>
								<i class="Btndelete"></i>
							</el-radio>
							<div class="addNewteam">
								<div class="normal-btn" @click="addTeam(true)"><img class="plus" src="@/assets/img/button_plus.png" alt="">添加分组</div>
								<div class="productBody" v-show="Model.addNewteam">
									<div class="productSec">
										<el-form ref="form" size="small" :inline="false">
											<el-form-item label="分组名称:" >
												<el-input v-model="Model.Groupingname"></el-input>
											</el-form-item>
										</el-form>
										<div class="normal-btn-group btnCenter">
											<div class="normal-btn query-btn" @click="addSureteam(true)">确认</div>
											<div class="normal-btn empty-input-btn" @click="Model.addNewteam=false">取消</div>
										</div>
									</div>
								</div>
							</div>
						</el-radio-group>-->
						<div class="normal-btn-group btnCenter">
							<div class="normal-btn query-btn" @click="addSure(true)">确认</div>
							<div class="normal-btn cancel-btn" @click="Model.addProduct=false">取消</div>		
						</div>
					</div>
				</div>
			</el-dialog>
			</div>
		</div>
	</div>
</template>

<script>
	import pathTracking from '@/components/common/pathTracking';
	import pagination from "@/components/common/pagination.vue";
	import advancedSearch from "@/components/common/filter/advancedSearch";
	import { getDateString } from "@/assets/js/common.js"
	import Model from './Model.js'
	import Controller from './controller.js'
	export default {
		name: "priceCheck",
		mixins: [Model, Controller],
		components: {
			advancedSearch,
			pathTracking,
			pagination
		},
	};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
	@import "./index.less";
</style>